<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
	pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="c" uri="/WEB-INF/tld/c.tld"%>
<%@taglib prefix="livra" uri="http://livra.com.ar/tld/utils"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<jsp:include page="header.jsp" />
<body>

        <div id="container">
            <div id="header">
                <h1>
                    <img src="img/livralogo.gif" border="0" />
                    <span>API</span>
                </h1>
            </div>
            
            <div id="mainbody">

                <h2>This is a demo of the Livra API for developers.</h2>
                <div class="content">
                    <div class="methods">Chose a criteria and a Category and navigate the Picks</div>
                    
                    <ul>
                       
                       <li>Get Picks by criteria 
                       
                           <form method="GET" style="display:inline" action="MethodsAction">
                                <input type="hidden" name="action" value="performSearchPicks"/>
                                    <livra:selectMap  mapObject="criterions" name="criterion"></livra:selectMap>                                 

                                Select a Category: 
                               <livra:selectMap  mapObject="categories" name="categories"></livra:selectMap>                                
                                
                                <input type="submit" value="get picks"></input>

                            </form>
                       </li>
                    </ul>           
                </div>     
                <c:if test="${! empty picks }">
	                <table>
	                <c:forEach items="${picks}"  var="pick">
	                    <tr><td> Pick question: <a href="MethodsAction?action=performSearchPick&pick_id=${pick.id}">${pick.question}</a> Author: <a href="${pick.user.link}">${pick.user.name}</a></td></tr>
	                
	                </c:forEach>
	                </table>
                </c:if>
                <c:if test="${! empty pick}">
                    <table>
                    <tr><td colspan="3"> Pick question: <a href="MethodsAction?action=performSearchPick&pick_id=${pick.id}">${pick.question}</a> Author: <a href="${pick.user.link}">${pick.user.name}</a></td></tr>
                    
                    <c:forEach items="${pick.options}" var="option">
                        <tr><td>${option.name}</td><td>${ option.voteCount / pick.voteCount * 100}</td><td><img src="${option.image}" width="100" height="100"></img></td></tr>    
                    </c:forEach>
                    </table>
                </c:if>
                
                </div>
            
            <div id="footer">
                <span>Livra.com</span>
            </div>
        </div>

    </body>
</html>